<template>
  <div>
    <el-table
      height="500"
      v-loading="listLoading"
      :data="list"
      highlight-current-row
    >
      <el-table-column
        label="培训分类"
        prop="trainClassify"
        width="120"
        sortable
      />
      <el-table-column label="培训类型" prop="type" width="150px" sortable />
      <el-table-column label="培训名称" prop="name" min-width="200px" />
      <el-table-column
        label="培训讲师"
        prop="trainerUserName"
        width="100px"
        align="center"
      />
      <el-table-column
        label="开始时间"
        prop="startTime"
        align="left"
        show-overflow-tooltip
        min-width="200px"
      />
      <!-- <el-table-column label="当前阶段" prop="phaseName" width="100px" />
          <el-table-column
            label="更新时间"
            prop="accessTimeString"
            width="150px"
          /> -->
      <el-table-column label="操作" align="center" width="60" fixed="right">
        <template slot-scope="{ row }">
          <el-dropdown trigger="click" class="filter-item">
            <el-button type="text"><i class="el-icon-more" /></el-button>
            <el-dropdown-menu slot="dropdown" class="user-dropdown">
              <!-- <el-dropdown-item @click.native.prevent="preview(row)"
                    >查看</el-dropdown-item
                  > -->
              <el-dropdown-item @click.native.prevent="handle(row)"
                >处理</el-dropdown-item
              >
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page-number.sync="listQuery.pageNumber"
      :page-size.sync="listQuery.pageSize"
      @pagination="getList"
    />
    <!-- <el-dialog title="取消流程申请" :visible.sync="dialogVisible" class="mini">
      <el-form label-width="80px">
        <el-form-item label="申请原因">
          <el-input
            v-model.trim="reason"
            type="textarea"
            placeholder="请输入内容"
            maxlength="200"
            show-word-limit
            :disabled="true"
          />
        </el-form-item>
        <el-form-item label="处理意见">
          <el-radio v-model="temp.radio" label="1">同意</el-radio>
          <el-radio v-model="temp.radio" label="2">拒绝</el-radio>
        </el-form-item>
        <el-form-item v-if="this.temp.radio == 2" label="审批意见">
          <el-input
            v-model.trim="temp.reason"
            type="textarea"
            placeholder="请输入内容"
            maxlength="200"
            show-word-limit
          />
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="cancelApply">确 定</el-button>
      </span>
    </el-dialog> -->
    <TrainFlow :TrainFlowData="TrainFlowData" @getList="getList"></TrainFlow>
  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import TrainFlow from '@/views/train/train_flow/index.vue'
import { TrainPageTodo, listNode } from '@/api/ts/train.js'
export default {
  components: { Pagination, TrainFlow },
  data() {
    return {
      listQuery: {
        pageNumber: 1,
        pageIndex: 0,
        pageSize: 10
      },
      list: [],
      total: 10,
      listLoading: false,
      path: {},
      dialogVisible: false,
      radio: '',
      temp: {},
      reason: '',
      TrainFlowData: {},
      dialogVisible: false
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    //   分页
    getList() {
      this.listLoading = true
      this.listQuery.pageIndex = this.listQuery.pageNumber - 1
      TrainPageTodo(this.listQuery)
        .then((res) => {
          this.list = res.data.rows
          this.total = res.data.total
          this.$store.commit('message/TRAIN_COUNT', res.data.total)
        })
        .finally(() => {
          this.listLoading = false
        })
    },
    handle(row) {
      listNode({
        trainId: row.trainId
      }).then((res) => {
        console.log(res,'eeew');
        this.TrainFlowData = {
          dialogVisible: true,
          row: res.data
        }
      })
    }
  }
}
</script>

<style scoped >
/* .my-table {

}
/deep/.el-table  {
    padding: 22px;
  } */
</style>
